<template>
	<scroll-view scroll-y="true" class="content">
		<view class="header">
			<image src="../../static/banner1.jpg" mode="aspectFill"></image>
			<view class="title">标题</view>
			<view class="secTitle">副标题</view>
		</view>
		<view class="text">
			内容内容内容内容内容内容内容
			内容内容内容内容内容内容内容
			内容内容内容内容内容内容内容
			内容内容内容内容内容内容内容
			内容内容内容内容内容内容内容
		</view>
	</scroll-view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style>
	.content {
		position: fixed;
		height: calc(100% - 90rpx);
		width: 100%;
		background: #eee;
	}

	.header {
		background: #fff;
		margin: 20rpx;
		width: calc(100% - 40rpx);
	}

	.header image {
		height: 500rpx;
		width: 100%;
	}
	.title {
		width: calc(100% - 40rpx);
		padding: 10rpx 20rpx 0rpx 20rpx;
		font-size: 32rpx;
		font-weight: bold;
		color: #333;
	}
	
	.secTitle {
		width: 100%;
		padding: 10rpx 20rpx 20rpx 20rpx;
		font-size: 28rpx;
		color: #666;
	}
	
	.text{
		margin: 20rpx;
		background: #fff;
		width: calc(100% - 80rpx);
		font-size: 32rpx;
		color: #666;
		line-height: 60rpx;
		padding: 20rpx;
		text-align: justify;
		text-indent: 2em;
	}
</style>
